<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>标特否”桌面壁纸</title>
    <link href="index.css" rel="stylesheet">
    <script src="vue.min.js"></script>
  </head>
  <body>
    <div id="app">
    <template>
        <div class="tiltebar">
            <h2>&nbsp;</h2>
            <div class="btn-list">
                <button v-on:click="showSet" class="btn btn-set" ><img src="set-white.png" width="25" height="25"/></button>
                <button v-on:click="min" class="btn btn-min" autofocus="false"><img src="min-white.png" width="25" height="25"/></button>
                <!-- <button v-on:click="max" class="btn btn-max" ></button> -->
                <button v-on:click="close" class="btn btn-close" ><img src="close-white.png" width="25" height="25"/></button>
            </div>
        </div>
        <div class="header">
            <div class="logo"><img src="btf_logo.png" width="87" height="87"/></div>
            <div>
                <div class="slogan">
                    标特否”桌面壁纸，定制您生活的Beautiful！
                </div>
                <ul class="nav">
                    <li v-for="item in navs">
                        <a v-on:click="goQuery(item.key)" v-if="item.key =='query'"><img src="query.png" width="20" height="20" class="jqQuery"/> {{item.label}}</a>
                        <a v-on:click="show(item.key)" v-else>{{item.label}}</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="condition" v-show="showCondition">
            <div class="box">
                <div class="btn2">
                    <b>壁纸分类：</b>
                    <div class="cont2">
                    	<a @click="query(0,null,null,null,$event)" v-bind:class="{active:condition.class.first == 0}">全部</a>
                        <a @click="query(191,null,null,null,$event)" v-bind:class="{active:condition.class.first == 191}">游戏壁纸</a>
                        <a @click="query(192,null,null,null,$event)" v-bind:class="{active:condition.class.first == 192}">卡通动漫</a>
                        <a @click="query(193,null,null,null,$event)" v-bind:class="{active:condition.class.first == 193}">家居壁纸</a>
                        <a @click="query(194,null,null,null,$event)" v-bind:class="{active:condition.class.first == 194}">军事壁纸</a>
                        <a @click="query(195,null,null,null,$event)" v-bind:class="{active:condition.class.first == 195}">汽车壁纸</a>
                        <a @click="query(196,null,null,null,$event)" v-bind:class="{active:condition.class.first == 196}">广告壁纸</a>
                        <a @click="query(197,null,null,null,$event)" v-bind:class="{active:condition.class.first == 197}">设计创意</a>
                        <a @click="query(198,null,null,null,$event)" v-bind:class="{active:condition.class.first == 198}">港台影视</a>
                        <a @click="query(199,null,null,null,$event)" v-bind:class="{active:condition.class.first == 199}">欧美影视</a>
                        <a @click="query(200,null,null,null,$event)" v-bind:class="{active:condition.class.first == 200}">日韩影视</a>
                        <a @click="query(201,null,null,null,$event)" v-bind:class="{active:condition.class.first == 201}">大陆影视</a>
                        <a @click="query(202,null,null,null,$event)" v-bind:class="{active:condition.class.first == 202}">港台明星</a>
                        <a @click="query(203,null,null,null,$event)" v-bind:class="{active:condition.class.first == 203}">欧美明星</a>
                        <a @click="query(204,null,null,null,$event)" v-bind:class="{active:condition.class.first == 204}">日韩明星</a>
                        <a @click="query(205,null,null,null,$event)" v-bind:class="{active:condition.class.first == 205}">大陆明星</a>
                        <a @click="query(206,null,null,null,$event)" v-bind:class="{active:condition.class.first == 206}">动物壁纸</a>
                        <a @click="query(207,null,null,null,$event)" v-bind:class="{active:condition.class.first == 207}">高清壁纸</a>
                        <a @click="query(208,null,null,null,$event)" v-bind:class="{active:condition.class.first == 208}">风景壁纸</a>
                        <a @click="query(209,null,null,null,$event)" v-bind:class="{active:condition.class.first == 209}">植物壁纸</a>
                        <a @click="query(2285,null,null,null,$event)" v-bind:class="{active:condition.class.first == 2285}">美女壁纸</a>
                        <a @click="query(2286,null,null,null,$event)" v-bind:class="{active:condition.class.first == 2286}">日历壁纸</a>
                        <a @click="query(2287,null,null,null,$event)" v-bind:class="{active:condition.class.first == 2287}">节日壁纸</a>
                        <a @click="query(2357,null,null,null,$event)" v-bind:class="{active:condition.class.first == 2357}">体育壁纸</a>
                        <a @click="query(2358,null,null,null,$event)" v-bind:class="{active:condition.class.first == 2358}">风格壁纸</a>
                        <a @click="query(2361,null,null,null,$event)" v-bind:class="{active:condition.class.first == 2361}">美食壁纸</a>

                    </div>            
                </div>
            </div>
            <div class="box">
                <div class="btn2">
                    <b>壁纸尺寸：</b> 
                    <div class="cont1">
                    	<a @click="query(null,null,0,null,$event)" v-bind:class="{active:condition.class.third == 0}">全部</a>
                        <a @click="query(null,null,1,null,$event)" v-bind:class="{active:condition.class.third == 1}">1024×768</a>
                        <a @click="query(null,null,2,null,$event)" v-bind:class="{active:condition.class.third == 2}">1280×800</a>
                        <a @click="query(null,null,3,null,$event)" v-bind:class="{active:condition.class.third == 3}">1280×1024</a>
                        <a @click="query(null,null,13,null,$event)" v-bind:class="{active:condition.class.third == 13}">1366x768</a>
                        <a @click="query(null,null,4,null,$event)" v-bind:class="{active:condition.class.third == 4}">1440×900</a>
                        <a @click="query(null,null,12,null,$event)" v-bind:class="{active:condition.class.third == 12}">1600×900</a>
                        <a @click="query(null,null,5,null,$event)" v-bind:class="{active:condition.class.third == 5}">1600×1200</a>
                        <a @click="query(null,null,6,null,$event)" v-bind:class="{active:condition.class.third == 6}">1680×1050</a>
                        <a @click="query(null,null,10,null,$event)" v-bind:class="{active:condition.class.third == 10}">1920x1080</a>
                        <a @click="query(null,null,7,null,$event)" v-bind:class="{active:condition.class.third == 7}">1920×1200</a>
                        <a @click="query(null,null,8,null,$event)" v-bind:class="{active:condition.class.third == 8}">1920×1440</a>
                        <a @click="query(null,null,14,null,$event)" v-bind:class="{active:condition.class.third == 14}">2560x1440</a>
                        <a @click="query(null,null,11,null,$event)" v-bind:class="{active:condition.class.third == 11}">2560x1600</a>
                        <a @click="query(null,null,9,null,$event)" v-bind:class="{active:condition.class.third == 9}">其它尺寸</a>


                    </div>            
                </div>
            </div>
            <div class="box">
                <div class="btn2">
                    <b>壁纸颜色：</b>
                    <div class="cont_cl clearfix">
                    	<a @click="query(null,0,null,null,$event)" title="全部" v-bind:class="condition.class.second == 0 ? 'active1':''">全部</a>
                        <a @click="query(null,1,null,null,$event)" title="黄色" v-bind:class="condition.class.second == 1 ? 'cl cl1 active' :'cl cl1'"></a>
                        <a @click="query(null,2,null,null,$event)" title="橙色" v-bind:class="condition.class.second == 2 ? 'cl cl2 active' :'cl cl2'"></a>
                        <a @click="query(null,3,null,null,$event)" title="红色" v-bind:class="condition.class.second == 3 ? 'cl cl3 active' :'cl cl3'"></a>
                        <a @click="query(null,4,null,null,$event)" title="粉色" v-bind:class="condition.class.second == 4 ? 'cl cl4 active' :'cl cl4'"></a>
                        <a @click="query(null,5,null,null,$event)" title="紫色" v-bind:class="condition.class.second == 5 ? 'cl cl5 active' :'cl cl5'"></a>
                        <a @click="query(null,6,null,null,$event)" title="绿色" v-bind:class="condition.class.second == 6 ? 'cl cl6 active' :'cl cl6'"></a>
                        <a @click="query(null,7,null,null,$event)" title="蓝色" v-bind:class="condition.class.second == 7 ? 'cl cl7 active' :'cl cl7'"></a>
                        <a @click="query(null,8,null,null,$event)" title="灰色" v-bind:class="condition.class.second == 8 ? 'cl cl8 active' :'cl cl8'"></a>
                        <a @click="query(null,9,null,null,$event)" title="黑色" v-bind:class="condition.class.second == 9 ? 'cl cl9 active' :'cl cl9'"></a>
                        <a @click="query(null,10,null,null,$event)" title="炫彩" v-bind:class="condition.class.second == 10 ? 'cl cl10 active' :'cl cl10'"></a>
                        <a @click="query(null,11,null,null,$event)" title="白色" v-bind:class="condition.class.second == 11 ? 'cl cl11 active' :'cl cl11'"></a>
                    </div>            
                </div>
            </div>
        </div>
        <div class="hot" v-show="!showCondition && !showError">
            <div class="loader loader-7" v-show="isLoading">
                <div class="line line1"></div>
                <div class="line line2"></div>
                <div class="line line3"></div>
            </div>
            <h2>{{title}}</h2>
            <div class="list">
                <ul class="clearfix">
                    <li v-for="(item,index) in list">
                        <img :src="item.img_url" class="single">
                        <a class="set" @click="setWallpaper(item.img_url,index)">{{item.set_btn_label}}</a>
                        <a class="set" @click="previewWallpaper(item.img_url,index)">{{item.preview_btn_label}}</a>
                    </li>
                    
                </ul>
            </div>
            <div class="page">
                <ul>
                    <li v-for="item in pages">
                        <span v-if="currentPage == item">{{item}}</span>
                        <a class="num" rel="nofollow" @click="showByPrevPage(currentPage)" v-else-if="'上一页' == item">{{item}}</a>
                        <a class="num" rel="nofollow" @click="showByNextPage(currentPage)" v-else-if="'下一页' == item">{{item}}</a>
                        <a class="num" rel="nofollow" @click="showByPage(item)" v-else-if="currentPage != item">{{item}}</a>
                    </li>
                </ul>
                
            </div>
        </div>
        <!--404-->
        <div class="error" v-if="showError">
            <div class="e-img"></div>
            <div class="e-box">
                <div class="e-text">
                    <b>SORRY 404</b>
                    <p>哎呀，您的页面走丢了哦！</p>
                    <!--<em>请检查您输入的网址是否有误。</em> -->
                </div>
                <div class="e-btn">
                    <a @click="goMain"><label>返回首页</label></a>
                    <!--<a href="#top"><span>刷新</span></a>-->
                </div>
            </div>
        </div>
        <div class="footer">
            <div>
                <label>CopyRight © 2020-2200 版权归标特否所有</label>
            </div>
            <div>
                <label>当前您的电脑分辨率：</label><label id="screen">{{screen}}</label>
            </div>
        </div>
        <div class="alert alert-mini" v-if="alert.show">
            <div class="alert-header">
                <h6>{{alert.title}}</h6>
                <img src="close-white.png" width="25" height="25" @click="closeAlert"/>
            </div>
            <div class="alert-content">
                <p>{{alert.content}}</p>
            </div>
        </div>

        <div class="dialog dialog-mini" v-if="dialog.show">
            <div class="dialog-header">
                <h6>设置</h6>
                <img src="close-white.png" width="25" height="25" @click="closeDialog"/>
            </div>
            <div class="dialog-content">
                <div class="form-item">
                    <label>
                    <input type="checkbox" v-if="dialog.autoLogin" checked v-model="dialog.autoLogin"/>
                    <input type="checkbox" v-if="!dialog.autoLogin" v-model="dialog.autoLogin"/>
                     开机自启动
                    </label>
                </div>
                <div class="form-item">
                    <label>
                    <input type="checkbox" v-if="dialog.isCircle" checked v-model="dialog.isCircle"/>
                    <input type="checkbox" v-if="!dialog.isCircle" v-model="dialog.isCircle"/>
                     循环更换页面壁纸
                    </label>
                </div>
                <div class="form-item"><label>间隔时间</label> <input type="number" class="interval" :value="dialog.interval" v-model="dialog.interval" @blur="defaultSet" /> <label>分钟</label></div>
            </div>
            <div class="dialog-footer">
                <input type="button" value="确定" @click="set"/>
            </span>
        </div>
    </template>
    </div>
    <script>
        const http       = require("http");
        const path       = require("path");
        const url        = require("url");
        const request    = require('request');
        const fs         = require("fs");
        const os         = require("os");
        const superagent = require("superagent");
        const cheerio    = require("cheerio");
        // const cmd        = require('node-cmd');
        const exec = require('child_process').exec;
        const { ipcRenderer } = require('electron');
        const iconv = require('iconv-lite');
    </script>
    <script src="common.js"></script>
  </body>
</html>